@utility dark-scrollbars-compat {
  scrollbar-color: rgb(71, 85, 105) rgb(30, 41, 59);
}

@utility dark-scrollbars {
  &::-webkit-scrollbar-track {
    @apply bg-slate-800;
  }

  &::-webkit-scrollbar-thumb {
    @apply bg-slate-600;
  }

  &::-webkit-scrollbar-thumb:hover {
    @apply bg-slate-500;
  }
}

@layer base {
  html {
    scrollbar-width: thin;
    scrollbar-color: rgb(156, 163, 175) rgb(249, 250, 251);
  }
  
  body::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }
  
  body::-webkit-scrollbar-track {
    @apply bg-gray-50;
  }
  
  body::-webkit-scrollbar-thumb {
    @apply bg-gray-400 rounded-sm;
  }
  
  body::-webkit-scrollbar-thumb:hover {
    @apply bg-gray-500;
  }
}
